<template>
	<!-- <view class="content">
		<view class="input-box">
			<u-icon name="account" class="icon" color="#ccc" size="28"></u-icon>
			<u-input v-model="uName" class="input" type="text" border="true" style="padding-left: 40rpx;" placeholder="昵称" />
		</view>
		<view class="input-box">
			<u-icon name="account" class="icon" color="#ccc" size="28"></u-icon>
			<u-input v-model="tel" class="input" type="number" border="true" style="padding-left: 40rpx;" placeholder="自己手机号码" />
		</view>
		<view class="input-box">
			<u-icon name="account" class="icon" color="#ccc" size="28"></u-icon>
			<u-input v-model="tuiJianTel" class="input" type="number" border="true" style="padding-left: 40rpx;" placeholder="推荐人手机号码" />
		</view>
		<view class="input-box">
			<u-icon name="lock" class="icon" color="#ccc" size="28"></u-icon>
			<u-input v-model="uPass" class="input"  border="true" type="password" style="padding-left: 40rpx;" placeholder="密码" />
		</view>
		<view class="input-box">
			<u-icon name="lock" class="icon" color="#ccc" size="28"></u-icon>
			<u-input v-model="uPass2" class="input"  border="true" type="password" style="padding-left: 40rpx;" placeholder="确认密码" />
		</view>
		<view class="input-box code-box">
			<u-input v-model="code" class="input"  border="true" type="text" style="padding-left: 40rpx;" placeholder="验证码" />
			<view class="codeBtn" @click="getCode()">获取验证码</view>
		</view>
		<view class="input-box">
			<button type="default" class="loginBtn" @click="zhuce()">注册</button>
		</view>
	</view> -->
</template>

<script>
	export default {
		data() {
			return {
				uName:'',	// 昵称
				tel:""	,// 手机号
				tuiJianTel:"",	// 推荐人手机号
				uPass:"",	// 密码
				uPass2:"",// 确认密码
				code:""//	 验证码
			}
		},
		methods: {
			// 获取验证码
			getCode(){
				this.$http.get('/sms/create', {
									phone:this.tel
								}).then(res => {
									console.log(res);
									if(res.data.code==200){
										this.$u.toast("发送成功，请注意查收");
									}
								})
			},
			// 注册新用户
			zhuce(){
				if(this.$u.test.isEmpty(this.uName)){
					this.$u.toast("昵称不能为空");
					return;
				}
				if(this.$u.test.mobile(this.tel)==false){
					this.$u.toast("请输入正确的手机号码");
					return;
				}
				if(this.$u.test.mobile(this.tuiJianTel)==false){
					this.$u.toast("请输入推荐人手机号");
					return;
				}
				if(this.$u.test.rangeLength(this.uPass,[6,16])==false){
					this.$u.toast("密码长度在6~16之间");
					return;
				}if(this.uPass!=this.uPass2){
					this.$u.toast("两次密码不一致");
					return;
				}if(this.$u.test.isEmpty(this.code)){
					this.$u.toast("验证码不能为空");
					return;
				}
			}
		}
	}
</script>

<style scoped>
	.content{
		margin-top: 30rpx;
	}
	.input-box{
		margin: 0rpx 20rpx;
		position: relative;
	}
.input-box .icon{
	position: absolute;
	left: 10rpx;
	top: 20rpx;
	z-index: 100;
}
.code-box{
		display: flex;
	}
	.code-box .codeBtn{
		line-height: 70rpx;
		background-color: white;
		border: 1px solid rgb(220, 223, 230);
		padding: 0px 30rpx;
	}
.input-box .input{
	background-color: white;
}
.loginBtn{
	margin-top: 30rpx;
	background-color: orange;
	color: white;
}
</style>
